<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{:lang("上传附件")}</title>
    <script src="__PUBLIC__/jquery/jquery.min.js"></script>
    <link rel="stylesheet" href="__PUBLIC__/layui/css/layui.css"  media="all">
    <link rel="stylesheet" href="__PUBLIC__/font-awesome/css/font-awesome.min.css" media="all" />
    <link rel="stylesheet" href="__CSS__/admin.css"  media="all">
</head>
<style>
    .layui-input-block{
        /*margin-left: 40px;*/
    }
    .layui-input{
        border-radius: 5px;
    }
    .file_show{
        color:blue;
        text-decoration:underline;
    }
</style>
<body>

<div>
    <form class="layui-form" id="saveFile" action="">
        <input type="hidden" name="product_id" value="{$product_id}">
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend>{:lang("上传附件")}</legend>
        </fieldset>
        <div class="layui-form-item">
            <label class="layui-form-label">{:lang('选择文件')}</label>
            <div class="layui-upload" id="upload-file">
                <button type="button" class="layui-btn layui-btn-normal" id="uploadBtn">{:lang('上传')}</button>
                <input type="hidden" name="file_url" id="file_url" value="">
                <div class="layui-inline" style="margin-left: 10px;color: red;font-size: 12px;">最大文件支持64M</div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">{:lang('文件名')}</label>
            <div class="layui-input-inline" style="width: 500px">
                <input id="file_name" name="file_name" readonly="readonly" lay-verify="required" {notempty name="$trip.up_filename"}value="{$trip.up_filename}"{/notempty} placeholder="" autocomplete="off" class="layui-input" type="text">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">{:lang('展示名称')}</label>
            <div class="layui-input-inline" style="width: 500px">
                <input id="show_title" name="show_title" lay-verify="required" {notempty name="$trip.up_filename"}value="{$trip.up_filename}"{/notempty} placeholder="" autocomplete="off" class="layui-input" type="text">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">{:lang('上传说明')}</label>
            <div class="layui-input-inline" style="width: 500px">
                <textarea placeholder="" class="layui-textarea" name="description" maxlength="255"></textarea>
            </div>
        </div>
    </form>
    <div class="layui-form-item">
        <label class="layui-form-label"></label>
        <div class="container">
            <button class="layui-btn" lay-submit lay-filter="saveFile">{:lang('提交')}</button>
        </div>
    </div>
</div>
</body>

<script src="__PUBLIC__/layui/layui.js"></script>
<script src="__PUBLIC__/jquery/jquery.min.js"></script>
<script>
    layui.use(['layer','form','jquery'],function() {
        var layer = layui.layer,
            $ = layui.jquery,
            form = layui.form;

        form.on('submit(saveFile)', function () {
            var product_id = $('input[name=product_id]').val();
            $.ajax({
                url: "/api/common/uploadProAttachment",
                data: $('#saveFile').serialize(),
                type: 'post',
                async: false,
                success: function (res) {
                    layer.msg(res.msg);
                    if (res.code > 0) {
                        setTimeout(function () {
                            //跳转到列表
                            window.location.href='{:url("admin/product/product_attachment")}?id='+product_id;
                        }, 1000)
                    }
                }
            })
        });


    })
</script>
<script>
    layui.use('upload', function(){
        var upload = layui.upload;
        //执行实例
        var uploadInst = upload.render({
            elem: '#uploadBtn' //绑定元素
            ,accept:'file'
            ,url: "{:url('common/upload')}" //上传接口
            ,done: function(res){
                console.log(res);
                //上传完毕回调
                layer.closeAll('loading');
                if(res.code == 2) {
                    $("#file_url").attr("value",res.src);
                    var name = res.name;
                    $("#file_name").attr("value",name);
                    var html = "<label class='layui-form-label'></label><a class='file_show' href='"+res.src+"'>"+name+"</a>";
                    $(".layui-upload-list").html(html);
                } else {
                    layer.msg(res.msg);
                }
                return false;
            }
            ,error: function(){
                layer.closeAll('loading');
                layer.msg(res.msg);
                return false;
            }
            ,before:function () {
                layer.load(2);
            }
        });
    });
</script>
</html>